<template>
  <div>
    <el-dialog :model-value="opens" @open="handleOpen">
      <el-table v-loading="loading" :data="ListGameTypeData">
        <el-table-column label="游戏名称" align="center" prop="categoryName" width="140"/>
        <el-table-column label="游戏平台" align="center" prop="platform">
          <template #default="scope">
            <dict-tag :options="game_platform" :value="scope.row.platform"/>
          </template>
        </el-table-column>
        <el-table-column label="描述" align="center" prop="description" width="140"/>
        <el-table-column label="状态" align="center" prop="isDisable">
          <template #default="scope">
            <dict-tag :options="zhen_disable" :value="scope.row.isDisable"/>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="140">
          <template #default="scope">
            <el-button type="text" @click="HandleGameType(scope.row)">选择</el-button>
          </template>
        </el-table-column>

      </el-table>
    </el-dialog>
  </div>
</template>

<script setup>
import {listGames} from "@/api/game/games.js";

const emit = defineEmits();
const ListGameTypeData = ref([]);
const loading = ref(false);


const {proxy} = getCurrentInstance();
const {zhen_disable} = proxy.useDict('zhen_disable');
const {game_platform} = proxy.useDict('game_platform');


const HandleGameType = (row) => {

  if ("1" === row.isDisable) {
    emit('onSelected', row)
  } else {
    alert("该数据被禁用")
  }
}
const handleOpen = () => {
  getListGames()
}
const getListGames = () => {
  listGames().then(ref => {
    ListGameTypeData.value = ref.rows;
    console.log(ListGameTypeData.value)
  })
}
const props = defineProps({
  opens: {
    type: Boolean,
    default: false
  }
})
</script>

<style scoped lang="scss">

</style>
